@import '../../vendor/func';

#root {
    background-color: #fff;
    border-bottom: 1px solid #ddd;
    border-top: 2px solid $primary;
    box-shadow: 0 3px 2px -2px rgba(200, 200, 200, .2);
    left: 0;
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 800;
    & > [data-role="menu"] { margin: .4rem 0; }
    & span.divid {
        border-right: 1px solid #ddd;
        margin: .5em .5em 0 .25em;
        height: 2em;
    }
}

#logo {
    @mixin background-retina ./images/logo, png, 148px, 35px;
    background-position: center center;
    background-repeat: no-repeat;
    height: 35px;
    width: 148px;
    @mixin text-hide;

    &:hover {
        @mixin background-retina ./images/logo2, png, 148px, 35px;
        background-color: transparent;
    }
}

.trans_input {
    margin-left: 20px;
    & input {
        width: 390px;
        border: none;
    }
}

.trans_box {
    & .trans_right, .trans_left  {
        width: 49%;
        min-width: 200px;
        min-height: 143px;
    }
    .trans_right {
        float: right;
        background-color: #efefef;
    }
    .trans_left {
        float: left;
    }
    a.close {
        position: absolute;
        bottom: 6px;
        left: 6px;
    }
}
